$(function () {

  // 获取页面对应的数据
  function init() {
    $.ajax({
      url: window.BigNew.category_list,
      success: function (response) {
        // 进行渲染
        if (response.code == 200) {
          const htmlStr = template('cateTemp', response);
          $('.container-fluid tbody').html(htmlStr);
        }
      }
    });
  }
  init();

  // 封装修改或是新增的请求
  function operation(url, data) {
    $.ajax({
      type: "post",
      url,
      data,
      success: function (response) {
        $("#myModal").modal('hide');
        $("#myForm")[0].reset();
        init();
      }
    });
  }

  // 监听模态框按钮的点击事件
  $('#btn-opt').on('click', function () {
    // 获取输入框数据
    const name = $("#cateName").val();
    const slug = $("#cateSlug").val();

    if ($(this).text() == '新增') {
      // 发送新增请求
      operation(window.BigNew.category_add, { name, slug });
      // $.ajax({
      //   type: "post",
      //   url: window.BigNew.category_add,
      //   data: { name, slug },
      //   success: function (response) {
      //     $("#myModal").modal('hide');
      //     $("#myForm")[0].reset();
      //     init();
      //   }
      // });
    } else {
      // 发送修改（编辑）请求
      operation(window.BigNew.category_edit, {
        name, slug,
        id: $('#cateId').val()
      });
      // $.ajax({
      //   type: "post",
      //   url: window.BigNew.category_edit,
      //   data: {
      //     name, slug,
      //     id: $('#cateId').val()
      //   },
      //   success: function (response) {
      //     console.log(response);
      //     $("#myModal").modal('hide');
      //     $("#myForm")[0].reset();
      //     init();
      //   }
      // });
    }

  });

  // 处理删除事件，事件委托
  $("tbody").on('click', '#btn-del', function () {
    $.ajax({
      type: "post",
      url: window.BigNew.category_delete,
      data: { id: $(this).data('id') },
      success: function (response) {
        if (response.code == 204) {
          init();
        }
      }
    });
  });

  // 处理编辑事件，事件委托
  $("tbody").on('click', '#btn-edit', function () {
    $('#myModalLabel').text('编辑分类');
    $('#btn-opt').text('编辑');

    $("#cateName").val($(this).data('name'));
    $("#cateSlug").val($(this).data('slug'));
    $("#cateId").val($(this).data('id'));

    $("#myModal").modal('show');


  });

  // 关闭模态框时，恢复原来的样式
  $("#myModal").on('hidden.bs.modal', function () {
    $('#myModalLabel').text('新增分类');
    $('#btn-opt').text('新增');
    $("#myForm")[0].reset();
  });
});